<template>
  <div class="page-container">
    <div class="page-header">
      <h2>客户详情</h2>
      <p>客户的详细信息、关联业务和工单</p>
    </div>

    <!-- 此页面作为占位符，您可以根据需求进行开发 -->
    <el-result
      icon="info"
      title="客户详情"
      :sub-title="`正在查看ID为 ${customerId} 的客户详情`"
    >
      <template #extra>
        <el-button type="primary" @click="$router.push('/dashboard/customers')">
          返回客户列表
        </el-button>
      </template>
    </el-result>

  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { useRoute } from 'vue-router'

const route = useRoute()
const customerId = ref(null)

onMounted(() => {
  customerId.value = route.params.id
})
</script>

<style lang="scss" scoped>
.page-header {
  margin-bottom: 20px;
  
  h2 {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
  }
  
  p {
    color: #666;
    font-size: 14px;
  }
}
</style> 